<template>
	<view>
		<view class="local">
			请输入需要查询的位置：<input type="text" placeholder="山西省太原市尖草坪区中北大学">
		</view>

		<view class="find">
			<button @click="show()">查询</button>
		</view>
		<map class="map" :longitude="longitude" :scale="scale" :latitude="latitude" :markers="markers"></map>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				longitude: 112.574352,
				latitude: 37.8774,
				scale: 15,
				markers: [{
						longitude: 112.574352,
						latitude: 37.8774,
						iconPath: '../../static/huoche.png',
						width: 10,
						height: 10
					},
					{
						longitude: 112.576991,
						latitude: 37.876659,
						iconPath: '../../static/huoche.png',
						width: 10,
						height: 10
					},
					{
						longitude: 112.575446,
						latitude: 37.871133,
						iconPath: '../../static/huoche.png',
						width: 10,
						height: 10
					},
					{
						longitude: 112.581591,
						latitude: 37.879764,
						iconPath: '../../static/huoche.png',
						width: 10,
						height: 10
					},
					{
						longitude: 112.57153,
						latitude: 37.878311,
						iconPath: '../../static/huoche.png',
						width: 10,
						height: 10
					},

				]
			}
		},
		onLoad() {

		},
		methods: {
			show() {
				uni.showModal({
					title: '出现火灾,请及时处理',
					content:'经度：112.574352  纬度：37.8774          地址：山西省太原市迎泽区柳巷               火灾级别：严重',
					confirmText:'导航到所在地'
					
				});
			}

		}
	}
</script>

<style>
	.local {
		float: left;
		width: 360rpx;
	}

	.find {
		float: right;
		width: 300rpx;
	}

	.map {
		width: 750rpx;
		height: 1334rpx;
	}
</style>
